import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:toolbox/common/sizeConfig.dart';
import 'package:toolbox/page/qr/qr_state.dart';
import 'package:toolbox/widgets/buttons.dart';
import 'package:toolbox/widgets/defaultFormField.dart';

import 'qr_logic.dart';

class QrPage extends StatefulWidget {
  QrPage({super.key});

  @override
  State<QrPage> createState() => _QrPageState();
}

class _QrPageState extends State<QrPage> with SingleTickerProviderStateMixin {
  final QrLogic logic = Get.put(QrLogic());

  final QrState state = Get
      .find<QrLogic>()
      .state;

  @override
  void initState() {
    super.initState();
    state.tabController = TabController(length: 2, vsync: this);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: GetBuilder<QrLogic>(builder: (logic) {
        return Column(
          children: [
            TabBar(
              tabs: const [Tab(text: '生成'), Tab(text: '扫描')],
              controller: state.tabController,
            ),
            Expanded(
              child: TabBarView(
                controller: state.tabController,
                children: [
                  _tabGenView(),
                  _tabScanView(),
                ],
              ),
            ),
          ],
        );
      }),
    );
  }

  Widget _tabGenView() {
    return SingleChildScrollView(
      child: Container(
        width: SizeConfig.screenWidth,
        padding: const EdgeInsets.symmetric(horizontal: 20),
        child: Column(
          children: [
            const SizedBox(height: 20),
            qrCodeView(),
            DefaultFormField(
              textEditingController: state.controller,
              hintText: '输入生成内容',
              maxLines: 10,
            ),
            const SizedBox(height: 20),
            state.logo != null
                ? Row(
              mainAxisSize: MainAxisSize.min,
              children: [
                Image.file(
                  state.logo!,
                  width: 100,
                  height: 100,
                ),
                IconButton(
                    onPressed: logic.onTapDeleteLogo,
                    icon: const Icon(Icons.cancel_outlined))
              ],
            )
                : Container(),
            Padding(
              padding: const EdgeInsets.symmetric(vertical: 10),
              child: MainButton(
                onTap: logic.onTapSelectLogo,
                text: '选择logo',
                icon: const Icon(Icons.photo_size_select_actual_outlined),
                textSize: 18,
              ),
            ),
            MainButton(
              onTap: logic.createQrCode,
              text: '生成二维码',
              icon: const Icon(Icons.qr_code),
              textSize: 18,
            ),
            const SizedBox(height: 100),
          ],
        ),
      ),
    );
  }

  Widget _tabScanView() {
    return SingleChildScrollView(
      child: Padding(
        padding: const EdgeInsets.only(left: 10, right: 10),
        child: Column(
          children: [
            const SizedBox(height: 20),
            MainButton(
              onTap: logic.onTapScan,
              text: '扫描',
              icon: const Icon(Icons.qr_code_scanner_outlined),
              textSize: 18,
            ),
            const SizedBox(height: 20),
            const Align(
              alignment: Alignment.centerLeft,
              child: Text('  扫描结果:'),
            ),
            Obx(() {
              return Container(
                width: SizeConfig.screenWidth,
                margin: const EdgeInsets.symmetric(horizontal: 0, vertical: 10),
                padding: const EdgeInsets.symmetric(
                    horizontal: 10, vertical: 6),
                decoration: BoxDecoration(
                  border: Border.all(color: Colors.grey),
                  borderRadius: const BorderRadius.all(Radius.circular(10)),
                ),
                child: SelectableText(state.scanValue.value.value ?? ''),
              );
            }),
            Align(
              alignment: Alignment.centerRight,
              child: Row(mainAxisSize: MainAxisSize.min, children: [
                IconButton(
                    onPressed: logic.onTapCopy, icon: const Icon(Icons.copy)),
                IconButton(
                    onPressed: logic.openUrl,
                    icon: const Icon(Icons.open_in_new_outlined)),
              ]),
            ),
          ],
        ),
      ),
    );
  }

  Widget qrCodeView() {
    if (state.codeFile == null) return Container();
    return Column(
      mainAxisSize: MainAxisSize.min,
      children: [
        GestureDetector(
          onLongPress: logic.saveQrCode,
          child: Image.file(state.codeFile!),
        ),
        Row(mainAxisAlignment: MainAxisAlignment.end, children: [
          IconButton(
              onPressed: logic.saveQrCode,
              icon: const Icon(Icons.save_outlined)),
          IconButton(
              onPressed: logic.shareQrCode,
              icon: const Icon(Icons.open_in_new_outlined)),
        ])
      ],
    );
  }
}
